<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>顶部菜单</title>

    <style>
      @font-face {
        font-family: PangMenZhengDao;
        src: url("../../assets/fonts/PangMenZhengDao-Regular.TTF")
          format("truetype");
      }

      body {
        margin: 0;
        padding: 0;
        color: white;
        background-image: url("../../assets/images/top_menu.png");
        background-repeat: no-repeat;
        width: 100%;
        height: 93px;
      }

      .LogoText {
        margin-left: 40px;
        height: 55px;
        font-size: 48px;
        font-family: PangMenZhengDao;
        font-weight: 400;
        color: #ffffff;
        line-height: 56px;
      }

      .Logo {
        display: flex;
        flex-flow: row nowrap;
        justify-content: flex-start;
        align-items: center;
        height: 100%;
      }

      /*小信息*/
      .SmallInfoText {
        width: 580px;
        height: 24px;
        font-size: 18px;
        font-family: Microsoft YaHei, Microsoft YaHei;
        font-weight: 400;
        color: rgba(255, 255, 255, 0.3);
        line-height: 21px;
        margin-left: 32px;
        align-self: auto;
        padding-top: 16px;
      }

      .WeatherBox {
        flex-grow: 1;
        display: inline-flex;
        flex-flow: row nowrap;
        justify-content: flex-end;
        align-items: center;
        font-family: PingFang SC, PingFang SC;
        font-size: 18px;
        font-weight: 400;
        color: #e0e0e0;
        line-height: 21px;
        margin-right: 40px;
      }

      .platform-btn{
        width: auto;
        height: 32px;
        line-height: 10px;
        font-size: 1rem;
        font-weight: 500;
        color: #e0e0e0;
        background-color: transparent;
        border: 1px solid rgba(255, 255, 255, 0.3);
        margin-right: 16px;
        border-radius: 6px;
        padding: 0 10px;
        cursor: pointer;
      }

      .platform-btn:hover{
        border: 1px solid #3191FF;
        color: #3191FF;
      }

      .icon {
        display: inline-block;
        margin-right: 4px;
      }
    </style>
  </head>
  <body>
    <div class="Logo">
      <span class="LogoText">惠州·中科院智慧管理平台</span>
      <span class="SmallInfoText" onclick="ShowDebugTools()"
        >Intelligent Management Platform for Institute of Physics CAS</span
      >
      <div class="WeatherBox">
        <span><button id="myPanelId" class="platform-btn" onclick="handlePanel()">面板隐藏</button></span>
        <span><button class="platform-btn" onclick="handlePlatform()">管理后台</button></span>
        <span id="TimerLabel">2024</span>
        <span class="WeatherChat_1" style="margin: 0 10px">|</span>
        <svg
          t="1703497841568"
          class="icon"
          viewBox="0 0 1024 1024"
          version="1.1"
          xmlns="http://www.w3.org/2000/svg"
          p-id="1583"
          width="24"
          height="24"
        >
          <path
            d="M505 732.8c-126 0-228.6-102.6-228.6-228.6s102.6-228.6 228.6-228.6 228.6 102.6 228.6 228.6-102.4 228.6-228.6 228.6z m0-415.8c-103.2 0-187 84-187 187s84 187 187 187c103.2 0 187-84 187-187s-83.8-187-187-187z"
            fill="#E0E0E0"
            p-id="1584"
          ></path>
          <path
            d="M505 102.2h13.8c7.6 0 13.8 6.2 13.8 13.8v124.8c0 7.6-6.2 13.8-13.8 13.8h-13.8c-7.6 0-13.8-6.2-13.8-13.8V116c0-7.6 6.2-13.8 13.8-13.8zM505 767.4h13.8c7.6 0 13.8 6.2 13.8 13.8V906c0 7.6-6.2 13.8-13.8 13.8h-13.8c-7.6 0-13.8-6.2-13.8-13.8v-124.8c0-7.6 6.2-13.8 13.8-13.8zM806.2 215.4l9.8 10c5.4 5.4 5.2 14.2-0.2 19.6L726.2 332c-5.4 5.4-14.2 5.2-19.6-0.2l-9.8-10c-5.4-5.4-5.2-14.2 0.2-19.6l89.4-87c5.6-5.4 14.4-5.2 19.8 0.2zM317.4 690.2l9.8 10c5.4 5.4 5.2 14.2-0.2 19.6l-89.4 87c-5.4 5.4-14.2 5.2-19.6-0.2l-9.8-10c-5.4-5.4-5.2-14.2 0.2-19.6l89.4-87c5.4-5.4 14.2-5.2 19.6 0.2zM782.2 490.2h124.8c7.6 0 13.8 6.2 13.8 13.8v13.8c0 7.6-6.2 13.8-13.8 13.8h-124.8c-7.6 0-13.8-6.2-13.8-13.8V504c0-7.6 6.2-13.8 13.8-13.8zM117 490.2h124.8c7.6 0 13.8 6.2 13.8 13.8v13.8c0 7.6-6.2 13.8-13.8 13.8H117c-7.6 0-13.8-6.2-13.8-13.8V504c0-7.6 6.2-13.8 13.8-13.8zM214.6 218.6l9.8-9.8c5.4-5.4 14.2-5.2 19.6 0.2l87.6 88.8c5.4 5.4 5.2 14.2-0.2 19.6l-9.8 9.8c-5.4 5.4-14.2 5.2-19.6-0.2l-87.4-88.8c-5.4-5.4-5.4-14.2 0-19.6zM692.6 704.4l9.8-9.8c5.4-5.4 14.2-5.2 19.6 0.2l87.4 88.8c5.4 5.4 5.2 14.2-0.2 19.6l-9.8 9.8c-5.4 5.4-14.2 5.2-19.6-0.2L692.4 724c-5.4-5.4-5.4-14.2 0.2-19.6z"
            fill="#E0E0E0"
            p-id="1585"
          ></path>
        </svg>
        <span>19℃-25℃</span>
      </div>
    </div>
    <script src="../../assets/lib/jquery-3.7.1.min.js"></script>
    <script src="../../config.js"></script>
    <script>
      // 初始化右边时间部件
      function InitTimeWidget() {
        const currentTime = new Date();
        const year = currentTime.getFullYear();
        const month = currentTime.getMonth() + 1; // 月份从0开始，因此需要加1
        const day = currentTime.getDate();
        //const hours = currentTime.getHours();
        //const minutes = currentTime.getMinutes();
        //const seconds = currentTime.getSeconds();
        $("#TimerLabel").text(`${year}-${month}-${day}`);
      }

      // 初始化天气部件
      function InitWeather() {}

      // 面板显示/隐藏
      function handlePanel() {
        let val = $("#myPanelId").html()
        if(val == "面板显示"){
          $("#myPanelId").html("面板隐藏")
          Fuck("func_html_chrome", "_RDP_", "set_visiable", "true")
        }else{
          $("#myPanelId").html("面板显示")
          Fuck("func_html_chrome", "_RDP_", "set_visiable", "false")
        }
      }

      function handlePlatform() {
        Fuck(
          "func_html_page",
          null,
          "open_url",
          window.iotWebConfig?.iotUrl +
            "/#/oauth?username=admin&password=4b78e581bdaffa037a6b11d58bdc934a"
        );
      }

      function ShowDebugTools() {
        var arg = {
          id: "调试工具",
          x: 0,
          y: 0,
          width: 0,
          height: 0,
          anchor: 5,
          source: "file:///bao_ying/debug.html",
          transform: "0.5,0.5",
          animation: {
            name: "fade+scale",
            duration: 0.5,
          },
        };

        // Fuck("func_html_page", null, "create_page", JSON.stringify(arg));
      }

      function InitPage() {
        // 这个UI控件在编辑器中勾选了默认不可见。加一个动画比较好，播放场景动画完全后会变得可见
        var arg = {
          name: "fade+transform",
          from_y: 100,
        };

        // Fuck("func_html_page", __self__, "set_animation",JSON.stringify(arg));
      }

      InitTimeWidget();
      InitWeather();

      InitPage();
    </script>
  </body>
</html>
